<div class="sm-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div class="panel panel-default panel-full">
            <div class="panel-heading">
                <a href="javascript:void(0);" data-url="/sys/dict/dict-type"
                   class="layui-btn layui-btn-sm layui-btn-primary">
                    <i class="iconfont icon-fanhui3"></i>
                </a>
                <span>字典管理-<%=$imports.getHashParam().name%></span>
            </div>
            <div class="panel-body">
                <div id="list_form" class="layui-form sm-operation">
                    <blockquote class="site-text layui-elem-quote">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">字典名称：</label>
                                <div class="layui-input-inline">
                                    <select id="dictType" name="dictType" lay-filter="dictType"
                                            data-value="<%=$imports.getHashParam().type%>"></select>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">字典标签：</label>
                                <div class="layui-input-inline">
                                    <input name="dictLabel" type="text" autocomplete="off" placeholder="字典标签"
                                           class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">状态：</label>
                                <div class="layui-input-inline">
                                    <select id="status" name="status" lay-filter="statusList">
                                        <option value="">全部</option>
                                        <option value="0">启用</option>
                                        <option value="1">禁用</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <button class="layui-btn" id="query"><i class="iconfont icon-sousuo"></i>查询</button>
                            </div>
                        </div>
                    </blockquote>
                    <div class="layui-form-item">
                        <button class="layui-btn layui-btn-normal" id="user_add">
                            <i class="iconfont icon-add"></i>添加
                        </button>
                        <button class="layui-btn layui-btn-danger" id="user_del">
                            <i class="iconfont icon-delete"></i>删除
                        </button>
                    </div>
                </div>
                <table id="list_table" class="layui-hide" lay-filter="mainList"></table>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['layer', 'table', 'form'], function () {
        var layer = layui.layer;
        var table = layui.table;
        var form = layui.form;
        var $ = layui.$;

        //表单重新渲染
        form.render();

        //表格渲染
        var tableObj = table.render({
            id: 'list_table', elem: '#list_table',
            url: '/sys/dict/data/list',
            align: "center",
            cols: [[ //表头
                {type: 'checkbox'},
                {type: 'numbers', title: '序号', width: 50},
                {field: 'dictLabel', title: '字典标签', width: 140, align: 'center'},
                {field: 'dictValue', title: '字典键值', width: 120, align: 'center'},
                {field: 'dictSort', title: '字典排序', width: 120, align: 'center'},
                {
                    field: 'status', title: '状态', width: 70, align: 'center', templet: function (d) {
                    return d.status == 0 ? '<span class="font-success">启用</span>' : '<span class="font-danger">禁用</span>';
                }
                },
                {field: 'remark', title: '备注', width: 150, align: 'center'},
                {field: 'createTime', title: '添加时间', width: 170, align: 'center'},
                {
                    field: 'lock', title: '操作', width: 170, templet: function (d) {
                    return '<button class="layui-btn layui-btn-sm layui-btn-warm " lay-event="edit">修改</button>' +
                        '<button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete" >删除</button>'
                }, unresize: true, align: 'center'
                }
            ]],
            where: {dictType: getHashParam().type}
            ,
        });

        //监听工具条
        table.on('tool(mainList)', function (obj) {
            var data = obj.data
                , layEvent = obj.event;
            //修改
            if (layEvent === 'edit') {
                smartAui.dialog({
                    title: '修改',
                    template: 'edit-data',
                    saveUrl: '/sys/dict/data/update',
                    tableObj: tableObj,
                    width: 500,
                    height: 600,
                    htmlData: data
                })
            }
            if (layEvent === 'delete') {
                smartAui.confirm('确认删除？', function () {
                    $.ajax({
                        type: "post",
                        url: '/sys/dict/data/delete',
                        data: {"dictId": data.dictId},
                        success: function (result) {
                            layer.msg(result.msg);
                            if (result.success) {
                                smartAui.reloadTable(tableObj);
                            }
                        }
                    })
                }, 0);
            }
        });
        // 添加
        $("#user_add").click(function () {
            smartAui.dialog({
                title: '添加',
                template: 'add-data',
                saveUrl: '/sys/dict/data/save',
                tableObj: tableObj,
                width: 500,
                height: 600
            })
        });
        // 删除
        $("#user_del").click(function () {
            var data = table.checkStatus('list_table').data;//已选中数据
            if (data.length == 0) {
                layer.msg("请至少选择一条");
                return;
            }
            var arr = [];
            for (var i = 0; i < data.length; i++) {
                arr.push(data[i].id);
            }
            smartAui.confirm("确认删除？", function () {
                $.ajax({
                    type: "post",
                    url: '/sys/dict/data/deleteBatch',
                    data: {"dictIds[]": arr},
                    success: function (result) {
                        if (result.success) {
                            layer.msg("删除成功");
                            smartAui.reloadTable(tableObj);
                        }
                    },
                    error: function () {
                        layer.msg("删除异常");
                    }
                })
            }, 0);
        });
        $("#query").click(function () {
            smartAui.reloadTable(tableObj);
        });
        // 标签
        smartAui.initSelect({
            elem: "#dictType",
            url: "/sys/dict/type/select",
            field: ["type", "name"],
            placeholder: false,
        });

        form.on('select(dictType)', function (data) {
            var $option = $(data.elem).find("option:selected");
            jumpByHash("/sys/dict/dict-data", {type: $option.val(), name: $option.text()});
        });
    });
</script>